<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>耐克Nike-耐克中国(wyf)</title>
    <link rel="icon" href="../images/nike_black.png">
    <!-- <link rel="icon" href="../images/nike_white.png"> -->
    <link rel="stylesheet" href="../css/reset.css">
    <link rel="stylesheet" href="../sass/css/header.css">
    <!-- <link rel="stylesheet" href="../sass/css/index.css"> -->
    <!-- <link rel="stylesheet" href="../css/swiper.css"> -->
    <link rel="stylesheet" href="../sass/css/cart.css">
</head>

<body>
    <header>
        <div class="top">
            <div class="w">
                <div class="wrapper1">
                    <ul class="nav_left">
                        <li class="pre-brand-item">
                            <a class="a1" href="">
                                <svg height="24px" width="24px" fill="#111" viewBox="0 0 26 32">
                                    <path
                                        d="M14.4 5.52v-.08q0-.56.36-1t.92-.44 1 .36.48.96-.36 1-.96.4l-.24.08.08.12-.08.44-.16 1.28q.08.08.08.16l-.16.8q-.08.16-.16.24l-.08.32q-.16.64-.28 1.04t-.2.64V12q-.08.4-.12.64t-.28.8q-.16.32 0 1.04l.08.08q0 .24.2.56t.2.56q.08 1.6-.24 2.72l.16.48q.96.48.56 1.04l.4.16q.96.48 1.36.84t.8.76q.32.08.48.24l.24.08q1.68 1.12 3.36 2.72l.32.24v.08l-.08.16.24.16h.08q.24.16.32.16h.08q.08 0 .16-.08l.16-.08q.16-.16.32-.24h.32q.08 0 0 .08l-.32.16-.4.48h.56l.56.08q.24-.08.4-.16l.4-.24q.24-.08.48.16h.08q.08.08-.08.24l-.96.88q-.4.32-.72.4l-1.04.72q-.08.08-.16 0l-.24-.32-.16-.32-.2-.28-.24-.32-.2-.24-.16-.2-.32-.24q-.16 0-.32-.08l-1.04-.8q-.24 0-.56-.24-1.2-1.04-1.6-1.28l-.48-.32-.96-.16q-.48-.08-1.28-.48l-.64-.32q-.64-.32-.88-.32l-.32-.16q-.32-.08-.48-.16l-.16-.16q-.16 0-.32.08l-1.6.8-2 .88q-.8.64-1.52 1.04l-.88.4-1.36.96q-.16.16-.32 0l-.16.16q-.24.08-.32.08l-.32.16v.16h-.16l-.16.24q-.16.32-.32.36t-.2.12-.08.12l-.16.16-.24.16-.36-.04-.48.08-.32.08q-.4.08-.64-.12t-.4-.6q-.16-.24.16-.4l.08-.08q.08-.08.24-.08h.48L1.6 26l.32-.08q0-.16.08-.24.08-.08.24-.08v-.08q-.08-.16-.08-.32-.08-.16-.04-.24t.08-.08h.04l.08.24q.08.4.24.24l.08-.16q.08-.16.24-.16l.16.16.16-.16-.08-.08q0-.08.08-.08l.32-.32q.4-.48.96-.88 1.12-.88 2.4-1.36.4-.4.88-.4.32-.56.96-1.2.56-.4.8-.56.16-.32.4-.32H10l.16-.16q.16-.08.24-.16v-.4q0-.4.08-.64t.4-.24l.32-.32q-.16-.32-.16-.72h-.08q-.16-.24-.16-.48-.24-.4-.32-.64h-.24q-.08.24-.4.32l-.08.16q-.32.56-.56.84t-.88.68q-.4.4-.56.88-.08.24 0 .48l-.08.16h.08q0 .16.08.16h.08q.16.08.16.2t-.24.08-.36-.16-.2-.12l-.24.24q-.16.24-.32.2t-.08-.12l.08-.08q.08-.16 0-.16l-.64.16q-.08.08-.2 0t.04-.16l.4-.16q0-.08-.08-.08-.32.16-.64.08l-.4-.08-.08-.08q0-.08.08-.08.32.08.8-.08l.56-.24.64-.72.08-.16q.32-.64.68-1.16t.76-.84l.08-.32q.16-.32.32-.56t.4-.64l.24-.32q.32-.48.72-.48l.24-.24q.08-.08.08-.24l.16-.16-.08-.08q-.48-.4-.48-.72-.08-.56.36-.96t.88-.36.68.28l.16.16q.08 0 .08.08l.32.16v.24q.16.16.16.24.16-.24.48-.56l.4-1.28q0-.32.16-.64l.16-.24v-.16l.24-.96h.16l.24-.96q.08-.24 0-.56l-.32-.8z">
                                    </path>
                                </svg>
                            </a>
                        </li>
                        <li class="pre-brand-item">
                            <a href="">
                                <svg height="24px" width="24px" fill="#111" viewBox="0 0 39 33">
                                    <path
                                        d="M10.94 25.626l-4.236-5.501L.201 22.28l3.734-5.756L.11 10.777l6.59 2.031 4.026-5.474.14 6.785 6.64 2.175-6.594 2.446.028 6.886zm.824 7.239l13.952-16.393L11.806.107h11.697l14.871 16.389-14.8 16.369h-11.81z">
                                    </path>
                                </svg>
                            </a>
                        </li>
                    </ul>

                    <div class="right">
                        <div class="help">
                            <span class="bang" id="help_hd">帮助</span>
                            <div class="help_hover">
                                <a class="zhu" href="">
                                    <span>帮助</span>
                                </a>
                                <ul class="nav_li">
                                    <li>
                                        <a href="">订单状态</a>
                                    </li>
                                    <li>
                                        <a href="">配送</a>
                                    </li>
                                    <li>
                                        <a href="">退换货</a>
                                    </li>
                                    <li>
                                        <a href="">联系我们</a>
                                    </li>
                                    <li>
                                        <a href="">隐私政策</a>
                                    </li>
                                    <li>
                                        <a href="">销售条款</a>
                                    </li>
                                    <li>
                                        <a href="">使用条款</a>
                                    </li>
                                    <li>
                                        <a href="#site-feedback">向我们发送反馈</a>
                                    </li>
                                </ul>
                            </div>
                        </div>
                        <span class="ml1-sm">|</span>

                        <div class="max_right1">
                            <a href="">
                                <span class="ml1-sm">NIKE会员</span>
                            </a>
                            <span class="ml1-sm">|</span>
                            <button class="loginBtn">登录</button>
                        </div>

                        <div class="max_right2">
                            <span class="showName">xxx</span>
                            <span>，您好</span>
                            <button class="logout">退出</button>
                        </div>

                        <span class="personal_center">
                            <a href="./personal_center.html">
                                <svg fill="#111" height="25px" width="25px" viewBox="0 0 24 24"
                                    style="display: inline-block;">
                                    <path
                                        d="M16.44 11A5.94 5.94 0 0 0 18 7 6 6 0 0 0 6 7a5.94 5.94 0 0 0 1.56 4A5 5 0 0 0 3 16v5a1 1 0 0 0 2 0v-5a3 3 0 0 1 3-3h8a3 3 0 0 1 3 3v5a1 1 0 0 0 2 0v-5a5 5 0 0 0-4.56-5zM8 7a4 4 0 1 1 4 4 4 4 0 0 1-4-4z">
                                    </path>
                                </svg>
                            </a>
                        </span>
                    </div>
                </div>

            </div>
        </div>

        <div class="w">
            <div class="wrapper2">
                <div class="logo">
                    <a href="./nike.html">
                        <svg class="pre-logo-svg" height="60px" width="60px" fill="#111" viewBox="0 0 69 32">
                            <path
                                d="M68.56 4L18.4 25.36Q12.16 28 7.92 28q-4.8 0-6.96-3.36-1.36-2.16-.8-5.48t2.96-7.08q2-3.04 6.56-8-1.6 2.56-2.24 5.28-1.2 5.12 2.16 7.52Q11.2 18 14 18q2.24 0 5.04-.72z">
                            </path>
                        </svg>
                    </a>
                </div>

                <ul class="nav_menu">
                    <li class="li1">
                        <span>新品尝鲜</span>
                        <div class="xin">
                            <ul class="nav_hot">
                                <li class="li_dan">热搜榜单</li>
                                <li>
                                    <a href="">
                                        ❄️御寒神器ACG系列
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        哈哈哈哈哈哈哈
                                    </a>
                                </li>
                            </ul>

                            <ul class="nav_new">
                                <li>
                                    <a href="">
                                        本月新品
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        本月新品
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        本月新品
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        本月新品
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        本月新品
                                    </a>
                                </li>
                            </ul>

                            <ul class="nav_app">
                                <li>
                                    <a href="">
                                        NIKE APP专属尖货
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        NIKE APP专属尖货
                                    </a>
                                </li>
                                <li>
                                    <a href="">
                                        NIKE APP专属尖货
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </li>
                    <li>
                        <span>男子</span>
                        <div class="man">

                        </div>
                    </li>
                    <li>
                        <span>女子</span>
                    </li>
                    <li>
                        <span>儿童</span>
                    </li>
                    <li>
                        <span>专属定制</span>
                    </li>
                    <li>
                        <a href="./list.html">
                            <span class="dian">商品点我</span>
                        </a>
                    </li>
                </ul>

                <div class="w2_right">
                    <div class="search">
                        <button class="magnifier">
                            <svg class="pre-search-input-icon" fill="#111" height="24px" width="24px"
                                viewBox="0 0 24 24">
                                <path
                                    d="M21.71 20.29L18 16.61A9 9 0 1 0 16.61 18l3.68 3.68a1 1 0 0 0 1.42 0 1 1 0 0 0 0-1.39zM11 18a7 7 0 1 1 7-7 7 7 0 0 1-7 7z">
                                </path>
                            </svg>
                        </button>
                        <input type="text" placeholder="搜索">
                    </div>

                    <div class="HeaderButtonGroup">
                        <div class="love">
                            <a href="">
                                <svg width="24px" height="24px" fill="#111" viewBox="0 0 24 24">
                                    <path
                                        d="M21.11 4a6.6 6.6 0 0 0-4.79-1.92A6.27 6.27 0 0 0 12 3.84 6.57 6.57 0 0 0 2.89 4c-2.8 2.68-2.45 7.3.88 10.76l6.84 6.63A2 2 0 0 0 12 22a2 2 0 0 0 1.37-.54l.2-.19.61-.57c.6-.57 1.42-1.37 2.49-2.41l2.44-2.39 1.09-1.07c3.38-3.55 3.8-8.1.91-10.83zm-2.35 9.4l-.25.24-.8.79-2.44 2.39c-1 1-1.84 1.79-2.44 2.36L12 20l-6.83-6.68c-2.56-2.66-2.86-6-.88-7.92a4.52 4.52 0 0 1 6.4 0l.09.08a2.12 2.12 0 0 1 .32.3l.9.94.9-.94.28-.27.11-.09a4.52 4.52 0 0 1 6.43 0c1.97 1.9 1.67 5.25-.96 7.98z">
                                    </path>
                                </svg>
                            </a>
                        </div>

                        <div class="Cart">
                            <a href="./cart.html">
                                <svg width="24px" height="24px" fill="#111" viewBox="0 0 24 24">
                                    <path
                                        d="M16 7a1 1 0 0 1-1-1V3H9v3a1 1 0 0 1-2 0V3a2 2 0 0 1 2-2h6a2 2 0 0 1 2 2v3a1 1 0 0 1-1 1z">
                                    </path>
                                    <path
                                        d="M20 5H4a2 2 0 0 0-2 2v13a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3V7a2 2 0 0 0-2-2zm0 15a1 1 0 0 1-1 1H5a1 1 0 0 1-1-1V7h16z">
                                    </path>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>


        <div class="login">
            <div class="lu">
                <div class="off">
                    <!-- <svg fill="#111" height="20px" width="20px" viewBox="0 0 24 24">
                        <path
                            d="M15.04 12L24 2.96 21.04 0 12 8.96 3.04 0 0 2.96 9.04 12 0 20.96 3.04 24 12 14.96 21.04 24 24 20.96z">
                        </path>
                    </svg> -->
                    ×
                </div>
                <div class="lo_top">
                    <svg class="pre-logo-svg" height="50px" width="50px" fill="#111" viewBox="0 0 69 32">
                        <path
                            d="M68.56 4L18.4 25.36Q12.16 28 7.92 28q-4.8 0-6.96-3.36-1.36-2.16-.8-5.48t2.96-7.08q2-3.04 6.56-8-1.6 2.56-2.24 5.28-1.2 5.12 2.16 7.52Q11.2 18 14 18q2.24 0 5.04-.72z">
                        </path>
                    </svg>
                    <div class="view-header">登录NIKE账号</div>
                </div>

                <input type="tel" placeholder="手机号" class="phonenumber1">
                <br>
                <span class="phoneNumberSpan1">手机号长度位11位</span>
                <br>
                <input type="text" placeholder="用户名" class="username1">
                <br>
                <span class="userSpan1">用户名不能以数字开头</span>
                <br>
                <input type="password" placeholder="密码" class="password1">
                <br>
                <span class="passwordSpan1">密码长度为6~12位</span>
                <br>
                <div class="yan">
                    <input type="text" class="code1" placeholder="请输入验证码">
                    <!-- 点击验证码会刷新 -->
                    <span class="showCode1"></span>
                </div>
                <!-- <button id="refresh">刷新验证码</button> -->
                <!-- <br> -->
                <span class="codeSpan1">可点击验证码刷新,验证码不区分大小写</span>
                <br>
                <button id="lgb_lu" disabled>登录</button>

                <div id="no_vip">
                    还不是会员？
                    <!-- <a class="join" href="">立即加入</a> -->
                    <span class="join">立即加入</span>
                </div>
            </div>
        </div>



        <div class="register">
            <div class="lu">
                <div class="off">
                    <!-- <svg fill="#111" height="20px" width="20px" viewBox="0 0 24 24">
                        <path
                            d="M15.04 12L24 2.96 21.04 0 12 8.96 3.04 0 0 2.96 9.04 12 0 20.96 3.04 24 12 14.96 21.04 24 24 20.96z">
                        </path>
                    </svg> -->
                    ×
                </div>
                <div class="lo_top">
                    <svg class="pre-logo-svg" height="50px" width="50px" fill="#111" viewBox="0 0 69 32">
                        <path
                            d="M68.56 4L18.4 25.36Q12.16 28 7.92 28q-4.8 0-6.96-3.36-1.36-2.16-.8-5.48t2.96-7.08q2-3.04 6.56-8-1.6 2.56-2.24 5.28-1.2 5.12 2.16 7.52Q11.2 18 14 18q2.24 0 5.04-.72z">
                        </path>
                    </svg>
                    <div class="view-header">创建您的 NIKE 帐户</div>
                    <!-- <div class="sub">我们需要验证您的号码以继续操作。我们将通过短信向您发送一条一次性的验证码。</div> -->
                </div>

                <input type="tel" placeholder="手机号" class="phonenumber">
                <br>
                <span class="phoneNumberSpan">手机号长度位11位</span>
                <br>
                <input type="text" placeholder="用户名" class="username">
                <br>
                <span class="userSpan">用户名不能以数字开头</span>
                <br>
                <input type="password" placeholder="密码" class="password">
                <br>
                <span class="passwordSpan">密码长度为6~12位</span>
                <br>
                <div class="yan">
                    <input type="text" class="code" placeholder="请输入验证码">
                    <!-- 点击验证码会刷新 -->
                    <span class="showCode"></span>
                </div>
                <!-- <button id="refresh">刷新验证码</button> -->
                <!-- <br> -->
                <span class="codeSpan">可点击验证码刷新,验证码不区分大小写</span>
                <br>
                <button id="lgb_ce" disabled>注册</button>

                <div id="no_vip">
                    已经是会员？
                    <!-- <a class="login_lo" href="">立即登录</a> -->
                    <span class="login_lo" href="">立即登录</span>
                </div>
            </div>
        </div>


    </header>

    <main>
        <div class="w">
            <div class="cartbox">
                <table id="cartTable">
                    <thead>
                        <tr>
                            <th><input class="check-all check" type="checkbox">&nbsp;&nbsp;全选</th>
                            <th>商品</th>
                            <th>单价</th>
                            <th>数量</th>
                            <th>小计</th>
                            <th>操作</th>
                        </tr>
                    </thead>
                    <tbody>
                        <!-- <tr>
                            <td class="checkbox">
                                <input class="check-one check" type="checkbox" />
                            </td>
                            <td class="goods">
                                <img src="" alt="" /><span>华为 Mate40 Pro</span>
                            </td>
                            <td class="price">6799</td>
                            <td class="count">
                                <span class="reduce off"></span>
                                <input class="count-input" type="text" value="1" />
                                <span class="add">+</span>
                            </td>
                            <td class="subtotal">6799</td>
                            <td class="operation">
                                <span class="delete">删除</span>
                            </td>
                        </tr> -->
                    </tbody>
                </table>
                <div class="foot" id="foot">
                    <a class="fl" id="deleteAll">删除</a>
                    <div class="fr closing">结 算</div>
                    <input type="hidden" id="cartTotalPrice" />
                    <div class="fr total">合计：<span id="priceTotal">0.00</span>￥</div>
                    <div class="fr selected" id="selected">已选商品<span id="selectedTotal">0</span>件</div>
                </div>
            </div>
        </div>
    </main>


    <footer>
        <div class="w">
            <div class="one_wyf">
                <div class="fo_top">
                    <ul class="nav_card">
                        <li class="footer-link">
                            <a target="_self" href="">电子礼品卡</a>
                        </li>
                        <li class="footer-link">
                            <a target="_self" href="">企业团购</a>
                        </li>
                        <li class="footer-link">
                            <a target="_self" href="">附近商店</a>
                        </li>
                        <li class="footer-link">
                            <a target="_self" href="">订阅电子邮件</a>
                        </li>
                        <li class="footer-link">
                            <a target="_self" href="">注册NIKE会员</a>
                        </li>
                        <li class="footer-link">
                            <a target="_self" href="#help_hd">向我们发送反馈</a>
                        </li>
                    </ul>

                    <ul class="nav_get_help">
                        <li class="get_li">
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                    </ul>

                    <ul class="nav_get_help about">
                        <li class="get_li">
                            <a href="">关于NIKE</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                        <li>
                            <a href="">获得帮助</a>
                        </li>
                    </ul>

                    <div class="fo_right">
                        <div class="wei_xin">
                            <a href="">
                                <svg width="30px" fill="#7e7e7e" height="30px" viewBox="0 0 24 24">
                                    <path
                                        d="M13.76 12a.612.612 0 0 0-.44.2c-.133.133-.2.267-.2.4s.067.267.2.4.293.2.48.2.36-.067.52-.2c.16-.133.24-.267.24-.4s-.08-.267-.24-.4a.848.848 0 0 0-.56-.2zm-2-2.88c.213 0 .4-.08.56-.24.16-.16.24-.347.24-.56a.645.645 0 0 0-.24-.52 1.062 1.062 0 0 0-.56-.24c-.213-.027-.413.04-.6.2s-.28.347-.28.56c0 .213.093.4.28.56.187.16.387.24.6.24zm-4.24-1.6c-.267 0-.493.08-.68.24-.187.16-.28.347-.28.56 0 .213.093.4.28.56.187.16.4.24.64.24s.427-.08.56-.24a.85.85 0 0 0 .2-.56.85.85 0 0 0-.2-.56.645.645 0 0 0-.52-.24zM12 0C9.813 0 7.8.533 5.96 1.6A11.793 11.793 0 0 0 1.6 5.96C.533 7.8 0 9.813 0 12s.533 4.2 1.6 6.04a11.793 11.793 0 0 0 4.36 4.36C7.8 23.467 9.813 24 12 24s4.2-.533 6.04-1.6a11.793 11.793 0 0 0 4.36-4.36C23.467 16.2 24 14.187 24 12s-.533-4.2-1.6-6.04a11.793 11.793 0 0 0-4.36-4.36C16.2.533 14.187 0 12 0zM9.52 15.36c-.427 0-1.013-.08-1.76-.24l-.4-.08-2.16 1.12.64-1.84c-1.653-1.173-2.48-2.56-2.48-4.16 0-1.44.6-2.667 1.8-3.68 1.2-1.013 2.653-1.52 4.36-1.52 1.493 0 2.827.413 4 1.24s1.893 1.853 2.16 3.08l-.64-.08c-1.44 0-2.667.48-3.68 1.44-1.013.96-1.52 2.107-1.52 3.44 0 .427.08.853.24 1.28h-.56zm8.96 2.16l.48 1.52-1.68-.96c-.8.213-1.413.32-1.84.32-1.44 0-2.667-.427-3.68-1.28-1.013-.853-1.52-1.893-1.52-3.12s.507-2.28 1.52-3.16c1.013-.88 2.227-1.32 3.64-1.32 1.413 0 2.64.44 3.68 1.32 1.04.88 1.56 1.947 1.56 3.2 0 1.253-.72 2.413-2.16 3.48zM17.12 12a.612.612 0 0 0-.44.2c-.133.133-.2.267-.2.4s.067.267.2.4.293.2.48.2.36-.067.52-.2c.16-.133.24-.267.24-.4s-.08-.267-.24-.4a.848.848 0 0 0-.56-.2z">
                                    </path>
                                </svg>
                            </a>
                            <div class="ma">
                                <img src="https://static.nike.com/a/images/w_960,c_limit/588c1078-1b99-40f6-86f2-3636daf5946d/image.png"
                                    alt="">
                            </div>
                        </div>
                        <div class="wei_bo">
                            <a href="" title="Weibo">
                                <svg width="30px" fill="#7e7e7e" height="30px" viewBox="0 0 24 24">
                                    <path
                                        d="M12 0C9.813 0 7.8.533 5.96 1.6A11.793 11.793 0 0 0 1.6 5.96C.533 7.8 0 9.813 0 12s.533 4.2 1.6 6.04a11.793 11.793 0 0 0 4.36 4.36C7.8 23.467 9.813 24 12 24s4.2-.533 6.04-1.6a11.793 11.793 0 0 0 4.36-4.36C23.467 16.2 24 14.187 24 12s-.533-4.2-1.6-6.04a11.793 11.793 0 0 0-4.36-4.36C16.2.533 14.187 0 12 0zm-1.6 18.56c-1.92 0-3.573-.4-4.96-1.2-1.547-.907-2.32-2.027-2.32-3.36 0-1.493.88-3.12 2.64-4.88 1.067-1.067 2.16-1.813 3.28-2.24 1.12-.427 1.893-.427 2.32 0 .427.427.507 1.12.24 2.08-.053.16 0 .24.16.24l.24-.08c.907-.373 1.707-.56 2.4-.56.693 0 1.187.2 1.48.6.293.4.28.973-.04 1.72-.053.16-.053.267 0 .32.053.053.16.107.32.16.587.16 1.08.44 1.48.84.4.4.6.893.6 1.48 0 .747-.333 1.507-1 2.28-.667.773-1.56 1.373-2.68 1.8-1.28.533-2.667.8-4.16.8zM16.64 8.4c-.267-.267-.613-.373-1.04-.32-.107.053-.227.04-.36-.04a.638.638 0 0 1-.28-.36.441.441 0 0 1 .08-.44.845.845 0 0 1 .4-.28 2.663 2.663 0 0 1 1.12.08c.373.107.693.307.96.6s.44.64.52 1.04c.08.4.067.787-.04 1.16a.638.638 0 0 1-.28.36.506.506 0 0 1-.44.04.607.607 0 0 1-.36-.32c-.08-.16-.093-.293-.04-.4.16-.427.08-.8-.24-1.12zm3.6 2.16a.771.771 0 0 1-.32.4.517.517 0 0 1-.52.04.762.762 0 0 1-.4-.36.607.607 0 0 1-.04-.48c.16-.533.187-1.093.08-1.68a2.945 2.945 0 0 0-.76-1.52 3.43 3.43 0 0 0-1.44-.92A2.658 2.658 0 0 0 15.2 6a1 1 0 0 1-.52-.12.648.648 0 0 1-.28-.4.6.6 0 0 1 .08-.52c.107-.16.24-.24.4-.24a3.957 3.957 0 0 1 2.36.08 4.79 4.79 0 0 1 2 1.32c.56.613.92 1.32 1.08 2.12.16.8.133 1.573-.08 2.32zm-10.48.16c-1.44.16-2.627.627-3.56 1.4-.933.773-1.36 1.627-1.28 2.56.08.933.653 1.68 1.72 2.24 1.067.56 2.32.773 3.76.64s2.627-.587 3.56-1.36c.933-.773 1.36-1.627 1.28-2.56-.08-.933-.653-1.68-1.72-2.24-1.067-.56-2.32-.76-3.76-.6v-.08zm2.48 4.48c-.267.64-.773 1.12-1.52 1.44-.747.32-1.467.36-2.16.12-.693-.24-1.173-.653-1.44-1.24-.267-.587-.253-1.187.04-1.8s.787-1.067 1.48-1.36c.693-.293 1.387-.347 2.08-.16.693.187 1.2.573 1.52 1.16.32.587.32 1.2 0 1.84zm-1.84-1.44c-.16-.107-.32-.053-.48.16-.053.053-.067.133-.04.24.027.107.093.16.2.16.213.107.373.053.48-.16.053-.107.067-.2.04-.28-.027-.08-.093-.12-.2-.12zm-1.04.4c-.213-.107-.453-.107-.72 0a1.211 1.211 0 0 0-.6.48.806.806 0 0 0-.12.64c.053.213.2.373.44.48.24.107.48.12.72.04.24-.08.427-.24.56-.48.133-.24.173-.467.12-.68a.716.716 0 0 0-.4-.48z">
                                    </path>
                                </svg>
                            </a>
                        </div>
                    </div>
                </div>
            </div>

            <div class="two_wyf">
                <div class="left">
                    <a title="已选地点: CN" href="">
                        <svg height="15px" width="18px" fill="white" viewBox="0 0 42 58">
                            <path
                                d="M21 0C9.4 0 0 9.5 0 21.2 0 39.9 21 58 21 58s21-18.1 21-36.8C42 9.5 32.6 0 21 0zm0 31c-5.5 0-10-4.5-10-10s4.5-10 10-10 10 4.5 10 10-4.5 10-10 10z">
                            </path>
                        </svg>
                        <span class="country">中国大陆</span>
                        <span id="copyright">© 2021 Nike, Inc. 保留所有权利</span>
                    </a>
                </div>
                <div class="right">
                    <ul>
                        <li>
                            <span>分类浏览</span>
                        </li>
                        <li>
                            <a target="_blank" href="">使用条款
                            </a>
                        </li>
                        <li>
                            <a target="_blank" href="">销售条款</a>
                        </li>
                        <li>
                            <a target="_blank" href="">隐私政策</a>
                        </li>
                        <li>
                            <a target="_self" href="">沪ICP备14009339号</a>
                        </li>
                        <li>
                            <a target="_self" href="">
                                <img alt="上海工商"
                                    src="https://static.nike.com/a/images/w_960,c_limit/fdbd071f-7dfc-4efc-a30c-da2be519db74/image.png">上海工商</a>
                        </li>
                    </ul>

                    <div class="an">
                        <a target="_self" href="">
                            <img alt="沪公网安备31011002000177号"
                                src="https://static.nike.com/a/images/w_960,c_limit/90620866-6f7d-4432-b843-7ac2cefc5b8e/image.png">沪公网安备31011002000177号</a>
                    </div>
                </div>
            </div>
        </div>
    </footer>


    <script src="../js/jquery.js"></script>
    <script src="../js/myAPI.js"></script>
    <script src="../js/cart.js"></script>
    <script src="../js/register.js"></script>
    <script src="../js/login.js"></script>

    <script>

        // 判断用户是否登录
        //   登录页面已经把用户名存在localStorage
        const user = localStorage.getItem('login_user');

        if (user) {
            $('.max_right2').style.display = 'block';
            $('.max_right1').style.display = 'none';
            $('.personal_center').style.display = 'block';
            $('.showName').innerHTML = user;
        }


        // 退出
        $('.logout').onclick = function () {
            localStorage.removeItem('login_user');
            $('.max_right2').style.display = 'none';
            $('.max_right1').style.display = 'block';
            $('.personal_center').style.display = 'none';
            location.href = './cart.html';
        }






        document.onclick = function (e) {
            var ev = e || event;
            // 兼容低版本IE
            const target = ev.target || ev.srcElement;



            // 登录
            if (target.className === 'loginBtn') {
                $('.login').style.display = 'block';
            }

            // 登录
            if (target.className === 'go_login') {
                $('.login').style.display = 'block';
            }


            // 登录/注册弹窗关闭
            if (target.className === 'off') {
                $('.login').style.display = 'none';
                $('.register').style.display = 'none';
            }


            // 登录转注册
            if (target.className === 'join') {
                $('.login').style.display = 'none';
                $('.register').style.display = 'block';
            }

            // 登录转注册
            if (target.className === 'login_lo') {
                $('.register').style.display = 'none';
                $('.login').style.display = 'block';
            }
        }


        // 拿到用户名
        // const user = localStorage.getItem('login_user');
        if (user) {
            // alert("ok")
            getUser();
        } else {
            // 创建的是一个标签对象
            const h2 = document.createElement('h2');
            // h2.innerHTML = `你还没登录<a href="./02myLogin.html?historyURL=${encodeURIComponent(location.href)}" class="goLogin">去登录</a>`;
            h2.innerHTML = `你还没有登录哦！<span class="go_login">去登录</span>`;
            $('main .w').appendChild(h2);
        }






        async function getUser() {
            const res = await myCart({
                username: user
            })
            console.log(res);
            const { status, msg, data } = res;
            if (status) {
                // 显示购物车
                $('.cartbox').style.display = 'block';
                let html = '';
                data.forEach(v => {
                    html += `
                        <tr data-id="${v.id}">
                            <td class="checkbox">
                                <input class="check-one check" type="checkbox" />
                            </td>
                            <td class="goods">
                                <img src="${v.img}" alt="" />
                                <span>${v.title}</span>
                            </td>
                            <td class="price">${v.price}</td>
                            <td class="count">
                                <span class="reduce off_">${v.num > 1 ? '-' : ''}</span>
                                <input class="count-input" type="text" value="${v.num}" />
                                <span class="add">+</span>
                            </td>
                            <td class="subtotal">${v.num * v.price}</td>
                            <td class="operation">
                                <span class="delete">删除</span>
                            </td>
                        </tr>
                        `
                })
                $('tbody').innerHTML = html;


                // let number = $$('.count-input').val();
                // if(number > 1){;
                //     $$('.reduce').removeClass('off_');
                //     $$('.reduce').html('-');
                // }else {
                //     $$('.reduce').addClass('off_');
                //     $$('.reduce').html('');
                // }

                // console.log(number);


                // oOnes = document.querySelectorAll('.check-one');
                // oAll = $('.check-all');

            } else {
                // 做一个跳转 --- 商品列表
                const h2 = document.createElement('h2');
                h2.innerHTML = `你的购物车空空如也哦!<a href="./list.html?historyURL=${encodeURIComponent(location.href)}" class="goLogin">去逛逛吧</a>`;
                $('main .w').appendChild(h2);
            }
        }





        // 登录
        $('#lgb_lu').onclick = async function () {
            const phonenumber = $('.phonenumber1').value;
            const username = $('.username1').value;
            const password = $('.password1').value;
            console.log(password);
            const res = await login({
                phonenumber,
                username,
                password
            })
            console.log(res);
            const { status, msg } = res;
            if (status) {
                localStorage.setItem('login_user', username);
                let url = location.search.split('?historyURL=')[1];

                if (url) {
                    url = decodeURIComponent(url);
                    alert(msg);
                    location.href = url;
                } else {
                    alert(msg);
                    location.href = './cart.html';
                }
            } else {
                alert(msg);
            }
        }


    </script>
</body>

</html>